What is the Hack about?

It's a two part hack-a-roo. The first part is node package that starts to create the same c# client api functionality for the web. The second part is a web tool that ""uses"" this api and creates a interactive visualization that reads in a speckle stream and calculates each object for byte size, area, and volume. This data is then tied into a tree-map and scatter plot to help illustrate the comparison of an object's byte size vs area. This tool allows users to select different parts of the model and filter out heavy geometry that they could modify / optimize from their modeling client. The hack hypothetically supports the ability to separate out the selected geometry into a new commit so the designer could modify them back in their software of choice... and by ""hypothetically"" I mean that we ran out of time and I'd like to sleep soon.

What inspired us for this Hack?

It's hard for designers to know what parts of their model are heavy, so we wanted to visualize the size and volume of an object in a similar way that WinDirStat does with storage.

How was the Hack built? What technology did we use?

Typescript React app with our main package refs to mobx, keystone, speckle-viewer, speckle-object-loader, and visx

What accomplishments are we most proud of?

'- Drafting out a client API as a node package for future apps to be built with! - Interactive charts that tie in with the speckle-viewer - A stronger understanding of how the web stuff works in the speckle world - Knowing why people hate d3